import 'package:flutter/material.dart';
import 'package:videotop/base_view.dart';
import 'package:videotop/model/signin_model.dart';
import 'package:videotop/myinfo.dart';
import 'package:videotop/util.dart';
import 'package:provider/provider.dart';
import '../screen_service.dart';

///
/// create by hx  time:{2020/12/16 22:19}
///

class Signin extends StatefulWidget {
  int day;
  Signin(this.day);
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _Signin();
  }
}

class _Signin extends State<Signin> {


  @override
  Widget build(BuildContext context) {
    return BaseView<SigninModel>(
      onModelReady: (model){
        model.getInit();
      },
      model: SigninModel(context,widget.day,Provider.of<Util>(context),Provider.of<MyInfo>(context)),
      builder: (context,model,child){
        return Material(
          //创建透明层
          type: MaterialType.transparency, //透明类型
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Container(
                  margin: EdgeInsets.only(top: 10, left: 40, right: 40),
                  width: ScreenService.width,
                  decoration: ShapeDecoration(
                    color: Colors.white,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(
                        Radius.circular(15.0),
                      ),
                    ),
                  ),
                  child: Column(
                    children: [
                      Container(
                        height: 80,
                        width: ScreenService.width,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.only(
                                topLeft: Radius.circular(15),
                                topRight: Radius.circular(15)),
                            color: Color(0xff3F2C9F)),
                        child: Stack(
                          children: [
                            Center(
                              child: Text(
                                'Daily Check-In!',
                                style: TextStyle(color: Colors.white, fontSize: 18,fontFamily: 'my_bold'),
                              ),
                            ),
                            Positioned(
                              right: 0,
                              top: 0,
                              child: GestureDetector(
                                child: Container(
                                  padding: EdgeInsets.all(10),
                                  child: Image.asset(
                                    'assets/image/homex.png',
                                    width: 15,
                                    height: 15,
                                    fit: BoxFit.cover,
                                  ),
                                ),
                                onTap: () {
                                  Navigator.pop(context);
                                },
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(top: 30),
                        child: Text(
                          'Check in daily for 7 days and get \n rewards.',
                          textAlign: TextAlign.center,
                          style: TextStyle(
                              color: Colors.grey,
                              fontSize: 15
                          ),
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 20, top: 20, right: 20),
                        child: Row(
                          children: [
                            item(model,1),
                            SizedBox(
                              width: 5,
                            ),
                            item(model,2),
                            SizedBox(
                              width: 5,
                            ),
                            item(model,3),
                            SizedBox(
                              width: 5,
                            ),
                            item(model,4),
                          ],
                        ),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 20, top: 5, right: 20),
                        child: Row(
                          children: [
                            item(model,5),
                            SizedBox(
                              width: 5,
                            ),
                            item(model,6),
                            SizedBox(
                              width: 5,
                            ),
                            item(model,7,flex: 2),
                          ],
                        ),
                      ),
                      GestureDetector(
                        onTap: (){
                          model.getQianDao();
                        },
                        child: Container(
                          height: 50,
                          margin: EdgeInsets.all(20),
                          decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular((30)),
                              color: Color(0xff3F2C9F)
                          ),
                          child: Center(
                            child: Text(
                              'CHECK IN',
                              style: TextStyle(color: Colors.white, fontSize: 16,fontFamily: 'my_bold'),
                            ),
                          ),
                        ),
                      )
                    ],
                  )),
            ],
          ),
        );
      },
    );
  }

  Widget item(SigninModel model,int index,{int flex:1}){
    return Expanded(
      flex: flex,
        child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular((5)),
            color: index == model.week?Color(0xff3F2C9F):Colors.white,
            border: Border.all(color: Colors.grey[200],width: 1)
          ),
          child: Column(
            children: [
              Container(
                height: 20,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(4),
                      topRight: Radius.circular(4)),
                  color: index == model.week?Color(0xff272443):Colors.grey[100],
                ),
                child: Center(
                  child: Text(
                    '${model.days[index]}',
                    style: TextStyle(
                        color: index == model.week?Colors.white:Colors.grey[600], fontSize: 12),
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 10),
                child: Image.asset(
                  'assets/image/${model.icons[index]}.png',
                  width: 45,
                  height: 30,
                  fit: BoxFit.cover,
                ),
              ),
              Container(
                margin: EdgeInsets.only(top: 5),
                child: Center(
                  child: Text(
                    '+ ${model.coins[index]}',
                    style: TextStyle(
                        color: index == model.week?Colors.white:Colors.grey[600], fontSize: 16),
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.only(bottom: 5),
                child: Center(
                  child: Text(
                    'Coins',
                    style: TextStyle(
                        color: index == model.week?Colors.white:Colors.grey[600], fontSize: 12),
                  ),
                ),
              ),
            ],
          ),
        ));
  }

}
